<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>服务器备份服务</title>
	<link rel="stylesheet" th:href="@{/layui/css/layui.css}">
	<style>
		body {
		    -webkit-user-select: none;
		    -moz-user-select: none;
		    -ms-user-select: none;
		    user-select: none;
		    padding: 15px;
		}
	  </style>
</head>
<body>
	<form class="layui-form" th:object="${setups}" style="margin-top:10px;">
		<input name="id" th:field="*{id}" type="hidden">
		<div class="layui-form-item">
			<label class="layui-form-label">清理时间：</label>
			<div class="layui-input-block">
				<input type="text" name="clearTime" class="layui-input" th:field="*{clearTime}" id="clearTime"  placeholder="请选择清理时间" lay-verify="required">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">保留份数：</label>
			<div class="layui-input-block">
				<input type="text" name="retainNum" th:field="*{retainNum}" placeholder="默认3份" class="layui-input" lay-verify="required|numverify"/>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
			    <button id="btn-submit" type="submit" class="layui-btn layui-btn-normal layui-btn-sm layui-btn-radius" lay-submit lay-filter="setups-edit">
					立即提交
				</button>
				<button type="reset" class="layui-btn layui-btn-primary layui-btn-sm layui-btn-radius">
					重置
				</button>
			</div>
		</div>
	</form>
</body>
<script th:src="@{/layui/layui.js}"></script>
<script th:inline="javascript">
    layui.use(['form', 'jquery', 'laydate'], function () {
        let form = layui.form;
        let $ = layui.jquery;
        let laydate = layui.laydate;

        let prefix = "/setups/";
        
        laydate.render({
            elem: '#clearTime',
            type: 'time'
        });
        
        form.verify({
        	numverify: function (value) {
				if (!validateNum(value)) {
				    return '请输入正确的数字';
				}
            }
        });
        
        form.on('submit(setups-edit)', function (data) {
        	$('#btn-submit').attr('disabled', true);// 禁用按钮防止重复提交
            $.ajax({
                url: prefix + 'save',
                data: JSON.stringify(data.field),
                dataType: 'json',
                contentType: 'application/json',
                type: 'put',
                success: function (result) {
                    if (result.success) {
                        layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                            parent.layer.close(parent.layer.getFrameIndex(window.name));
                        });
                    } else {
                    	$('#btn-submit').attr('disabled', false);
                        layer.msg(result.msg, {icon: 2, time: 1000});
                    }
                }
            })
            return false;
        });
        
		window.validateNum = function(num) {
			const pattern = /^[1-9]\d*$/;
			return pattern.test(num);
		}
		
	});
    
</script>
</html>